<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <!-- import CSS -->
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <!-- import Vue before Element -->
  <script src="https://unpkg.com/vue/dist/vue.js"></script>
  <!-- import JavaScript -->
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
  <style>

  </style>
</head>
<body>
<div id="app">
  <el-button :plain="true" @click="open2">成功</el-button>
  <el-button :plain="true" @click="open3">警告</el-button>
  <el-button :plain="true" @click="open1">消息</el-button>
  <el-button :plain="true" @click="open4">错误</el-button>
  <script>
    var app = new Vue({
      el:'#app',
      methods:{
        open2() {
          this.$message({message: '恭喜你,添加成功!', type: 'success'});
        },
        open1() {
          this.$message('简单提示信息');
        },
        open3() {
          this.$message({message: '警告！', type: 'warning'});
        },
        open4() {
          this.$message.error('错了！');
        }
      }
    });
  </script>
</div>
</body>
</html>